<template>
    <up-popup :show="show" @close="close">
        <view class="_approve">
            <view class="top">
                <text class="tit">还货审核</text>
            </view>
            <view class="line">
                <u-radio-group v-model="bool" placement="row">
                    <u-radio activeColor="#3c9cff" :name="1" label="审核通过"></u-radio>
                    <u-radio activeColor="#3c9cff" :name="0" label="审核拒绝"></u-radio>
                </u-radio-group>
            </view>
            <view class="line">
                <textarea class="input" placeholder="请输入理由,拒绝时必填" v-model="remark"></textarea>
            </view>
            <view class="btn">
                <up-button text="确认审核" type="error" :loading="loading" @click="onSubmit"></up-button>
            </view>
        </view>
    </up-popup>
</template>

<script setup>
import { ref } from 'vue'
import { returnApprove } from '@/api/merchant.js'
import { showToast } from '@/utils/util'

const props = defineProps({
    show: {
        type: Boolean,
        default: false
    },
    id: {
        type: [Number, String],
        default: ''
    }
})

const emit = defineEmits(['close', 'update'])
const bool = ref(1)
const remark = ref('')
const loading = ref(false)

const close = () => {
    emit('close')
}

const onSubmit = () => {
    if (bool.value === 0 && remark.value === '') {
        showToast('请输入拒绝理由')
        return false
    }
    const data = {
        approve: bool.value ? true : false,
        merchantRemark: remark.value,
        applyId: props.id
    }
    loading.value = true
    returnApprove(data).then(res => {
        showToast('审核成功')
        emit('update')
        loading.value = false
    }).catch(e => {
        loading.value = false
    })
}
</script>

<style lang="scss" scoped>
._approve {
    .tit {
        font-size: 28rpx;
        line-height: 96rpx;
        text-align: center;
        font-weight: 700;
    }
    .line {
        padding: 0 $zzk-margin 20rpx;
    }
    .input {
        width: 100%;
        box-sizing: border-box;
        background-color: #f5f5f5;
        height: 240rpx;
        padding: 20rpx;
        font-size: 28rpx;
        line-height: 40rpx;
        border-radius: 8rpx;
    }
    .btn {
        padding: 20rpx $zzk-margin;
    }
}
</style>